<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8" />
      <title>Edge Premium Web Template</title>
      <!-- don't forget to paste your page title! -->
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <meta name="description" content="" />
      <meta name="author" content="" />
      <!-- Le styles -->
      <!-- bootstrap framework styles -->
      <link href="css/bootstrap.css" rel="stylesheet" />
      <!-- fancybox lightbox clone plugin styles -->
      <link href="css/fancybox.css" rel="stylesheet" />
      <!-- icomoon icons font  -->
      <link href="css/icomoon.css" rel="stylesheet" />
      <!-- sequence slider styles -->
      <!--[if lt IE 8]>
      <link rel="stylesheet" type="text/css" media="screen" href="css/sequencejs_ie.css" />
      <![endif]-->
      <link rel="stylesheet" type="text/css" media="screen" href="css/sequencejs.css" />
      <!-- main template styles -->
      <link href="css/styles.css" rel="stylesheet" />
      <!-- place for your custom styles -->
      <link href="css/mystyle.css" rel="stylesheet" />
      <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
      <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
      <![endif]-->
   </head>
   <body class="">
      <!-- Backround image. Just paste yours. No extra code. Highly recommend to use your own images -->
      <!-- background images by Victor1558 under CC BY 2.0 license -> http://www.flickr.com/photos/76029035@N02/ -->
      <img src="img/bg_main_blog.jpg" id="bg_main" alt="" />
      <!--recommended image dimentions 1200x800px with weight under 120kb 
         !note! don't use very light images. It can damage readability of the white text -->
      <div class="container">
         <!-- Main navigation -->
         <div class="row">
            <div class="span12">
               <div class="navbar">
                  <div class="navbar-inner">
                     <div class="container">
                        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </a>
                        <a class="brand" href="index.html">Project name</a>
                        <div class="nav-collapse">
                           <ul class="nav">
                              <li>
                                 <a href="index.html">Home</a>
                                 <ul>
                                    <li><a href="index_2.html">Simple Slider</a></li>
                                    <li><a href="index_3.html">Slider Fullwidth</a></li>
                                    <li><a href="index_4.html">Slider Alt</a></li>
                                    <li><a href="index_5.html">Slider Alt 2</a></li>
                                    <li><a href="index_6.html">No Slider</a></li>
                                    <li><a href="index_7.html">No Slider Alt</a></li>
                                    <li><a href="index_8.html">No Slider Alt 2</a></li>
                                    <li><a href="index_9.html">No Slider Alt 3</a></li>
                                 </ul>
                              </li>
                              <li>
                                 <a href="portfolio.html">Portfolio</a>
                                 <ul>
                                    <li><a href="portfolio_1.html">4 Column</a></li>
                                    <li><a href="portfolio.html">3 Column</a></li>
                                    <li><a href="portfolio_2.html">2 Column</a></li>
                                    <li><a href="portfolio_3.html">Portflio Alt</a></li>
                                    <li><a href="portfolio_page.html">Project Page</a></li>
                                 </ul>
                              </li>
                              <li>
                                 <a href="gallery.html">Gallery</a>
                                 <ul>
                                    <li><a href="gallery.html">4 Column</a></li>
                                    <li><a href="gallery_1.html">3 Column</a></li>
                                 </ul>
                              </li>
                              <li><a href="about.html">About</a></li>
                              <li class="active">
                                 <a href="blog.html">Blog</a>
                                 <ul>
                                    <li><a href="post.html">Post</a></li>
                                 </ul>
                              </li>
                              <li><a href="contact.html">Contact</a></li>
                           </ul>
                           <!-- social navigation area -->
                           <ul class="nav pull-right">
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Facebook"><span class="icomoon-facebook"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Twitter"><span class="icomoon-twitter"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Google +"><span class="icomoon-google-plus"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Vimeo"><span class="icomoon-vimeo"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Flickr"><span class="icomoon-flickr"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Feed"><span class="icomoon-feed"></span></a></li>
                              <li><a href="#" rel="tooltip" data-placement="bottom" title="Dribble"><span class="icomoon-dribbble"></span></a></li>
                           </ul>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <!-- /Main navigation -->
         <header class="page_title">
            <h1>Blog <small>um a fermentum nec, suscipit eu tortor. Ut ut nisi</small> </h1>
         </header>
         <div class="row">
            <div class="span8">
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Business Ownership Management</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">12 nov <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_1.jpg" alt="" />by <span>Olive Yew</span></li>
                           <li class="category">in Business</li>
                           <li class="comments">8 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_1.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Safety & Regulatory Compliance</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">08 nov <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_2.jpg" alt="" />by <span>Teri Dactyl</span></li>
                           <li class="category">in Lifestyle</li>
                           <li class="comments">5 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_2.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Applications & Best Practices</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">01 nov <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_3.jpg" alt="" />by <span>Peg Legge</span></li>
                           <li class="category">in Services</li>
                           <li class="comments">3 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_3.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Allie Grater</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">The whiner's room</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">25 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_4.jpg" alt="" />by <span>Simon Cyrene</span></li>
                           <li class="category">in Business</li>
                           <li class="comments">12 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_4.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Bad and good performance</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">23 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_5.jpg" alt="" />by <span>Dixie Normous</span></li>
                           <li class="category">in Services</li>
                           <li class="comments">10 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_5.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">The best way to get unstuck</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">15 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_3.jpg" alt="" />by <span>Simon Cyrene</span></li>
                           <li class="category">in Lifestyle</li>
                           <li class="comments">7 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_6.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Getting over ourselves</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">13 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_1.jpg" alt="" />by <span>Olive Yew</span></li>
                           <li class="category">in Lifestyle</li>
                           <li class="comments">5 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_7.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">10 Things You Can Learn</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">05 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_6.jpg" alt="" />by <span>Plenty O’Toole</span></li>
                           <li class="category">in Business</li>
                           <li class="comments">3 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_8.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <!-- blog entry -->
               <article class="post">
                  <h3><a href="post.html">Free social-media webinar</a></h3>
                  <div class="row-fluid">
                     <div class="span3">
                        <ul class="meta">
                           <li class="date">01 oct <span>2012</span></li>
                           <li class="autor"> <img src="../img/30x30_a_7.jpg" alt="" />by <span>Dustin</span></li>
                           <li class="category">in Business</li>
                           <li class="comments">2 comments</li>
                        </ul>
                     </div>
                     <div class="span9 block">
                        <a href="post.html" class="hover_image"> 
                        <span class="mask"></span> 
                        <span class="icomoon-anchor icon_hover"></span> 
                        <img src="../img/870x400_b_9.jpg" alt="" />
                        </a>
                        <div class="box">
                           <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam molestie pharetra sed ac lorem. Vestibulum molestie ullamcorper tincidunt. Quisque tincidunt congue quam at vulputate. Cras aliquam imperdiet odio, nec placerat nibh rutrum ac.Aliquam mi urna, element</p>
                           <a href="post.html" class="btn btn-primary btn-small">Read More</a>
                        </div>
                     </div>
                  </div>
               </article>
               <div class="pagination block">
                  <ul>
                     <li><a href="#">Prev</a></li>
                     <li><a href="#">1</a></li>
                     <li><a href="#">2</a></li>
                     <li><a href="#">3</a></li>
                     <li><a href="#">4</a></li>
                     <li><a href="#">Next</a></li>
                  </ul>
               </div>
            </div>
            <div class="span4">
               <aside class="sidebar_right">
                  <!-- text widget area -->
                  <h4>Text Widget</h4>
                  <div class="box block">
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta. Mauris sit amet magna elit. Mauris sed magna vel enim congue condimentum sit amet et augue. Duis tincidunt interdum varius. Suspendisse vel sem vitae quam </p>
                  </div>
                  <!-- subscribe area -->
                  <h4>Subscribe</h4>
                  <div class="box block">
                     <p>Donec pretium sagittis justo vel lobortis. Suspendisse dictum eleifend quam quis porta</p>
                     <div class="input-append">
                        <input class="span2" id="appendedInputButton" size="16" type="text" /><button class="btn btn-primary" type="button">Subscribe!</button>
                     </div>
                     <span class="help-block">* we never send spam</span>
                  </div>
                  <!-- twitter area -->
                  <h4>Twitter</h4>
                  <div class="box block">
                     <div class="twitter"></div>
                  </div>
                  <!-- blog feed area -->
                  <h4>Recent Blog Posts</h4>
                  <div class="box block">
                     <div class="feed">
                         <article>
                           <a href="post.html" class="hover_image">
                           <span class="mask"></span>
                           <img src="../img/50x50_b_1.jpg" alt="" />
                           </a>
                           <header class="content">
                              <div class="date">12.11.2012</div>
                              <h5><a href="post.html">Business Ownership Management</a></h5>
                           </header>
                        </article>
                        <article>
                           <a href="post.html" class="hover_image">
                           <span class="mask"></span>
                           <img src="../img/50x50_b_2.jpg" alt="" />
                           </a>
                           <header class="content">
                              <div class="date">08.11.2012</div>
                              <h5><a href="post.html">Safety & Regulatory Compliance</a></h5>
                           </header>
                        </article>
                        <article>
                           <a href="post.html" class="hover_image">
                           <span class="mask"></span>
                           <img src="../img/50x50_b_3.jpg" alt="" />
                           </a>
                           <header class="content">
                              <div class="date">01.11.2012</div>
                              <h5><a href="post.html">Applications & Best Practices</a></h5>
                           </header>
                        </article>
                     </div>
                  </div>
                  <!-- video widget -->
                  <h4>Video Widget</h4>
                  <div class="block">
                     <!-- Video -->
                     <!-- paste here your video to involve your audence
                        !note! This video is only for demostration purpose. Don't use it in your actual website
                        video made by Microsoft Research -> https://vimeo.com/msradesignteam -->
                     <iframe src="http://player.vimeo.com/video/39564783?title=0&amp;byline=0&amp;portrait=0&amp;badge=0&amp;color=ffffff" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
                     <div class="box">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium sagittis justo vel lobortis. </p>
                     </div>
                  </div>
               </aside>
            </div>
         </div>
         <section class="main">
            <!-- main footer -->
            <footer class="main">
               <div class="row">
                  <div class="span8">
                     <!-- footer main nav -->
                     <nav>
                        <ul>
                           <li><a href="index.html">Inicio</a></li>
                           <li><a href="projects.html">Proyectos</a></li>
                           <li><a href="clients.html">Clientes</a></li>
                           <li><a href="about.html">Nosotros</a></li>
                           <li><a href="services.html">Servicios</a></li>
                           <li><a href="catalog.html">Cat&aacute;logo</a></li>
                           <li><a href="contact.html">Contacto</a></li>
                        </ul>
                     </nav>
                  </div>
                  <div class="span4">
                     <small>Copyright © <a href="index.html">Edge</a> 2012</small>
                  </div>
               </div>
            </footer>
         </section>
      </div>
      <!-- /container --><!-- Le javascript
         ================================================== -->
      <!-- Placed at the end of the document so the pages load faster -->
      <script src="js/jquery.js"></script>
      <!-- Bootstrap Framework script -->
      <script src="js/bootstrap.js"></script>
      <script> $(function() { $('.carousel').carousel() }); </script>
      <script type="text/javascript">
         $("[rel=tooltip]").tooltip();
      </script>
      <!-- plugin for background images -->
      <script src="js/bg_image.js"></script>
      <!-- Fancybox plugin -->
      <script type="text/javascript" src="js/fancybox.js"></script>
      <script type="text/javascript">
         $(document).ready(function() {
         	/*
         	*   Examples - images
         	*/
         
         	$("a#example1").fancybox({
         		'padding'		    : '0',
         		'transitionIn'	: 'fade',
         		'transitionOut'	: 'fade',
         		'overlayColor' : '#000',
         		'showNavArrows' : false,
         		'titlePosition'		: 'outside',
         		'overlayOpacity' : 0.7,
         		'width'		: 960,
         		'height' : 540
         
         	});
         
         	$("a#example2").fancybox({
         		'overlayShow'	: false,
         		'transitionIn'	: 'elastic',
         		'transitionOut'	: 'elastic'
         	});
         
         	$("a#example3").fancybox({
         		'transitionIn'	: 'none',
         		'transitionOut'	: 'none'	
         	});
         
         	$("a#example4").fancybox({
         		'opacity'		: true,
         		'overlayShow'	: false,
         		'transitionIn'	: 'elastic',
         		'transitionOut'	: 'none'
         	});
         
         	$("a#example5").fancybox();
         
         	$("a#example6").fancybox({
         		'titlePosition'		: 'outside',
         		'overlayColor'		: '#000',
         		'overlayOpacity'	: 0.9
         	});
         
         	$("a#example7").fancybox({
         		'titlePosition'	: 'inside'
         	});
         
         	$("a#example8").fancybox({
         		'titlePosition'	: 'over'
         	});
         
         	$("a[rel=example_group]").fancybox({
         		'padding'		    : '0',
         		'transitionIn'	: 'fade',
         		'transitionOut'	: 'fade',
         		'overlayColor' : '#000',
         		'showNavArrows' : true,
         		'titlePosition'		: 'outside',
         		'overlayOpacity' : 0.7
         
         	});
         
         	/*
         	*   Examples - various
         	*/
         
         	$("#various1").fancybox({
         		'titlePosition'		: 'inside',
         		'transitionIn'		: 'none',
         		'transitionOut'		: 'none'
         	});
         
         	$("#various2").fancybox();
         
         	$("#various3").fancybox({
         		'width'				: '75%',
         		'height'			: '75%',
         		'autoScale'			: false,
         		'transitionIn'		: 'none',
         		'transitionOut'		: 'none',
         		'type'				: 'iframe'
         	});
         
         	$("#various4").fancybox({
         		'padding'			: 0,
         		'autoScale'			: false,
         		'transitionIn'		: 'none',
         		'transitionOut'		: 'none'
         	});
         });
      </script><!-- plugin for twitter display -> http://tweet.seaofclouds.com/ -->
      <!-- I am using envato twitter acount as the demo. Don't forget paste yours -->
      <script type="text/javascript" src="js/tweet.js"></script>
      <script type="text/javascript">
         //settings for the sidebar twitter area
         jQuery(function($){
           $(".twitter").tweet({
             join_text: "auto",
             username: "envato", //!paste here your twitter username!
             count: 3,
             auto_join_text_default: " we said, ",
             auto_join_text_ed: " we ",
             auto_join_text_ing: " we were ",
             auto_join_text_reply: " we replied ",
             auto_join_text_url: " we were checking out ",
             loading_text: "loading tweets..."
           });
         });
         
      </script>
      <!-- Plugin for responsive video -> http://fitvidsjs.com/ -->
      <script src="js/fitvids.js"></script>
      <script>
         $(".container").fitVids();
         $(".container").fitVids({ customSelector: "iframe[src^='http://socialcam.com']"});  
      </script>
      <!-- Script for goolge maps on contact page -->
      <script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
      <script src="js/gmaps.js"></script>
      <script type="text/javascript">
         $(function(){
           $('#map').gmap3({
             marker:{
               address: "Haltern am See, Weseler Str. 151" //place Your address here
             },
             map:{
               options:{
                 zoom: 14
               }
             }
           });
         });
      </script>
      <!-- Sequence slider plugin -->
      <script type="text/javascript" src="js/sequence.jquery-min.js"></script>
      <script type="text/javascript">	
         /mobile/i.test(navigator.userAgent) && !location.hash && setTimeout(function () {
           if (!pageYOffset) window.scrollTo(0, 1);
         }, 1000);
         
         $(document).ready(function(){
         	var options = {
         		autoPlay: true,
         		nextButton: true,
         		prevButton: true,
         		animateStartingFrameIn: true,
         		autoPlayDelay: 3000,
         		transitionThreshold: 500
         	};
         
         	var sequence = $("#sequence").sequence(options).data("sequence");
         
         	sequence.afterLoaded = function(){
         		$("#nav").fadeIn(100);
         		$("#nav li:nth-child("+(sequence.settings.startingFrameID)+") img").addClass("active");
         	}
         
         	sequence.beforeNextFrameAnimatesIn = function(){
         		$("#nav li:not(:nth-child("+(sequence.nextFrameID)+")) img").removeClass("active");
         		$("#nav li:nth-child("+(sequence.nextFrameID)+") img").addClass("active");
         	}
         	
         	$("#nav li").click(function(){
         		if(!sequence.active){
         			$(this).children("img").removeClass("active").children("img").addClass("active");
         			sequence.nextFrameID = $(this).index()+1;
         			sequence.goTo(sequence.nextFrameID);
         		}
         	});
         });
      </script>
   </body>
</html>